<template>
  <el-dialog title="分配权限" :visible.sync="isShow" @close="$refs.tree.setCheckedKeys([])">
    <!-- 默认展开
           el-tree
               node-key="字段名，且是唯一的，一般都是id"
              :default-expanded-keys="['需要展开项的id']"

         默认选中（以前有没有勾选它不理，它只管把当前需要选中的项选中）el-tree没有渲染前使用
           el-tree
               node-key="字段名，且是唯一的，一般都是id"
              :default-checked-keys="['需要选中项的id']"

        设置勾选项（el-tree已渲染）
            el-tree
                node-key="字段名，且是唯一的，一般都是id"
                ref="tree"
                this.$refs.tree.setCheckedKeys(['需要选中项的id'])
           清空  this.$refs.tree.setCheckedKeys([])

        获取已勾选项
           el-tree
                node-key="字段名，且是唯一的，一般都是id"
                ref="tree"
                this.$refs.tree.getCheckedKeys()
     -->
    <el-tree ref="tree" check-strictly node-key="id" :default-expanded-keys="['604f7df5f900be1850edb152']" :default-checked-keys="permIds" :data="list" show-checkbox :props="{label:'name',children:'children'}" />
    <template #footer>
      <div style="text-align:center">
        <el-button type="primary" @click="submit">确定</el-button>
        <!-- <el-button type="primary" @click="$refs.tree.setCheckedKeys(['604f7e07f900be1850edb153'])">设置公司设置项选中</el-button> -->
        <el-button @click="isShow=false">取消</el-button>
      </div>
    </template>
  </el-dialog>
</template>
<script>
// 导入权限数据列表接口
import { sysPermission } from '@/api/permission'
import { changeData } from '@/utils/index'
import { sysRoleId, sysRoleAssignPrem } from '@/api/setting'
export default {
  data() {
    return {
      isShow: false,
      list: [],
      permIds: [],
      id: ''
    }
  },
  methods: {
    // 获取权限列表
    async  getData() {
      if (!this.list.length) {
        const res = await sysPermission()
        this.list = changeData(res.data, '0')
        console.log('权限列表', res)
      }
    },
    // 获取角色详情
    async getRoleInfo(id) {
      this.id = id
      const res = await sysRoleId(id)
      // 存储权限点数组
      this.permIds = res.data.permIds
      // this.$refs.tree.setCheckedKeys(res.data.permIds)
      console.log('角色详情', res)
    },
    // 确定点击
    async   submit() {
      await sysRoleAssignPrem({
        id: this.id,
        permIds: this.$refs.tree.getCheckedKeys()
      })
      this.$message.success('分配权限成功')
      this.isShow = false
      // console.log(this.$refs.tree.getCheckedKeys())
    }
  }
}
</script>
<style>
</style>
